<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
	    <title>Kitchen Sink</title>
	    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	    <link rel="stylesheet" type="text/css" href="/js/extjs/resources/css/ext-all.css" />
	    <script type="text/javascript" src="/js/extjs/ext-all.js"></script>

	    <script type="text/javascript">
	    var uname = new Ext.form.TextField( {  
	        id :'uname',  
	        fieldLabel : '用户名',  
	        name : 'name',//元素名称  
	        //anchor:'95%',//也可用此定义自适应宽度  
	        allowBlank : false,//不允许为空  
	        value : "",  
	        blankText : '用户名不能为空'//错误提示内容  
	    });  
	    var pwd = new Ext.form.TextField( {  
	        id : 'pwd',  
	        inputType : 'password',  
	        fieldLabel : '密　码',  
	        maxLength : 10,  
	        name : 'password',  
	        allowBlank : false,  
	        value : "",  
	        blankText : '密码不能为空'  
	    });  
	      
	    Ext.onReady(function() {  
	        //使用表单提示  
            Ext.QuickTips.init();  
            Ext.form.Field.prototype.msgTarget = 'side';  
  
            //定义表单  
            var simple = new Ext.FormPanel
            			({  
            					margin  :  '20 0 0 0',  
						        defaultType : 'textfield',//默认字段类型  
						        border : true,  
						        buttonAlign : 'center',  
						        border : false,  
						        id : "form",  
						        items : [ uname, pwd ],  
						        buttons : [ {  
						            text : '登录',  
						            type : 'submit',  
						            id : 'sb',  
						            //定义表单提交事件  
						            handler : save  
						        }, {  
						            text : '重置',  
						            handler : function() {  
						                simple.form.reset();  
						            }  
						        } ],  
						        keys : [ {  
						            key : Ext.EventObject.ENTER,  
						            fn : save,  
						            scope : this  
						        } ]  
						    }); 
	            function save() 
	            {  
	                var userName = uname.getValue();  
	                var userPass = pwd.getValue();  
	                //验证合法后使用加载进度条  
	                if (simple.form.isValid()) {  
	                    //提交到服务器操作  
	                    simple.form.submit({  
	                        waitMsg : '正在进行登陆验证,请稍后...',  
	                        url : '/pages/login.jsp',  
	                        method : 'post',  
	                        params : {  
	                        userName : userName,  
	                        userPass : userPass  
	                        },  
	                        //提交成功的回调函数  
	                        success : function(form, action) {  
	                            if (action.result.data == true) 
	                            {  
	                            	self.location="/js/index.jsp";  
	                            }else 
	                            { 
	                            	Ext.Msg.confirm('错误提示录','登录失败，您的帐号或者密码错误！');  
	                            }  
	                        },  
	                        //提交失败的回调函数  
	                        failure : function(form, action) {  
	                            switch (action.failureType) {    
	                            case Ext.form.Action.CLIENT_INVALID:    
	                                Ext.Msg.alert('错误提示', '表单数据非法请核实后重新输入！');    
	                                break;    
	                            case Ext.form.Action.CONNECT_FAILURE:    
	                                Ext.Msg.alert('错误提示', '网络连接异常！');    
	                                break;    
	                            case Ext.form.Action.SERVER_INVALID:    
	                               Ext.Msg.alert('错误提示', "您的输入用户信息有误，请核实后重新输入！");    
	                               simple.form.reset();      
	                            }  
	                        }  
	                    });  
	                }  
	            };  
	            //定义窗体  
	            var win = new Ext.Window({  
	                id : 'win',  
	                layout : 'fit', //自适应布局     
	                align : 'center',  
	                width : 330,  
	                height : 182,  
	                resizable : false,  
	                draggable : false,  
	                border : false,  
	                maximizable : false,//禁止最大化  
	                closeAction : 'close',  
	                closable : false,//禁止关闭,  
	                items : simple  
	            //将表单作为窗体元素嵌套布局  
	            });  
	            win.show();//显示窗体  
	            pwd.focus(false, 100);  
	        });  
	</script>  
	</body>  
	</html>
